<template>
<div>
  <div class="columns">
    <div class="column">
      <oolongTimePicker type="time" placeholder="选择时间" style="width: 168px"></oolongTimePicker>
    </div>
    <div class="column">
      <oolongTimePicker type="timerange" placement="bottom-end" placeholder="选择时间" style="width: 168px"></oolongTimePicker>
    </div>
  </div>
  <br><br>
  <div class="columns">
    <div class="column">
      <oolongTimePicker :value="value1" format="HH点mm分ss秒" placeholder="选择时间" style="width: 168px"></oolongTimePicker>
    </div>
    <div class="column">
      <oolongTimePicker :value="value2" format="HH’mm’ss" type="timerange" placement="bottom-end" placeholder="选择时间" style="width: 168px"></oolongTimePicker>
    </div>
  </div>
  <br><br>
  <div class="columns">
    <div class="column">
      <oolongTimePicker format="HH:mm" placeholder="选择时间" style="width: 112px"></oolongTimePicker>
    </div>
    <div class="column">
      <oolongTimePicker format="HH:mm" type="timerange" placement="bottom-end" placeholder="选择时间" style="width: 168px"></oolongTimePicker>
    </div>
  </div>
</div>
</template>
<script>
  export default{
    data(){
      return {
        value1: '09:41:00',
        value2: ['09:41:00', '12:00:00']
      }
    }
  }
</script>
<style lang="scss" scoped>

</style>
